import React from 'react';
import { Button } from 'antd';

interface IVButtonGroupProps {
  btns: {
    text: string;
    type?: 'primary' | 'ghost' | 'dashed' | 'link' | 'text' | 'default';
    size?: 'large' | 'middle' | 'small';
    danger?: boolean;
    disabled?: boolean;
    shape?: 'circle' | 'round';
    extra?: { [key: string]: any };
  }[];
  style?: React.CSSProperties;
}
const VButtonGroup: React.FC<IVButtonGroupProps> = props => {
  const { btns = [], style } = props;
  return (
    <div className="v-button-group-wrapper" style={style}>
      {btns.map((btn, index) => {
        return (
          <Button
            {...btn}
            {...btn.extra}
            style={{ marginRight: index !== btns.length ? '5px' : 0 }}
          >
            {btn.text}
          </Button>
        );
      })}
    </div>
  );
};

export default VButtonGroup;
